<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <title>登录</title>
    <link type="text/css" href="${pageContext.request.contextPath}/css/style.css" rel="stylesheet"/>
    <link href="https://at.alicdn.com/t/font_1126822_bheq7e6ga8.css" rel="stylesheet" type="text/css"/>
    <link href="${pageContext.request.contextPath}/css/my_animation.css" rel="prefetch" type="text/css"/>
</head>

<body class="unAbleSelect">
<div id="stars"></div>
<div id="stars2"></div>
<div id="stars3"></div>
<div id="title">
    <span>欢迎登录</span>
</div>
<div class="login">
    <div class="signinpanel">
        <form>
            <div class="welcome">人流量预警云平台</div>
            <div class="form-group">
                        <span id="accountSpan" class="input-with-icon">
                            <input value="skyblue" type="text" maxlength="15" class="form-control" id="username" placeholder="请输入账号"/>
                            <i class="iconfont acc">&#xe634;</i>
                        </span>
                <span id="passwordSpan" class="input-with-icon">
                            <input value="123456" type="password" maxlength="15" class="form-control" id="password"
                                   placeholder="请输入密码"/>
                            <i class="iconfont pwd">&#xe63e;</i>
                        </span>
            </div>
            <button id="loginBtn" type="button" class="outlineBtn">登录</button>
        </form>
    </div>
</div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
        integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script src="${pageContext.request.contextPath}/js/jQuery.md5.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/js/jquery.cookie.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/js/public.js" type="text/javascript"></script>
<script type="text/javascript" async>
    function submit(){
        // SetLoading(true);
        let username = $("#username").val();
        let password = $("#password").val();
        if (username === "root"||(username.length > 5 && password.length > 5)) {
            $.liteAjax("${pageContext.request.contextPath}/api/login", {
                account: username,
                password: $.md5(password)
            }, function (data) {
                SetLoading(false);
                let mode = data.mode;
                let msg = data.msg;
                let type = data.type;
                Cookies.remove("acc");
                Cookies.remove("pw");
                Cookies.remove("type");
                Cookies.remove("sign");
                if (mode === 1) {
                    if (msg === 1) {
                        message("没有该账号！申请注册成功，您已可以临时登录，请等待管理员批准", 4000, "alert-success")
                        Cookies.set("acc",username);
                        Cookies.set("pw",$.md5(password));
                        Cookies.set("type",type);
                        Cookies.set("sign",-1);
                        window.location="${pageContext.request.contextPath}/default"
                    } else if(msg===-1){
                        message("申请注册失败，请稍后再试", 2000, "alert-warning");
                    }else {
                        message("功能异常！",2000,"alert-danger")
                    }
                }else if(mode===2){
                    if(msg===2){
                        message("登录成功",1000,"alert-success");
                        Cookies.set("acc",username);
                        Cookies.set("pw",$.md5(password));
                        Cookies.set("type",type);
                        Cookies.set("sign",0);
                        window.location="${pageContext.request.contextPath}/default"
                    }else if(msg===-2){
                        message("密码错误",1000,"alert-warning")
                    }else {
                        message("功能异常！",2000,"alert-danger")
                    }
                }else {
                    message("功能异常！",2000,"alert-danger")
                }
            })
        } else{
            message("账号密码长度都必须大于5", 2000, "alert-warning")
        }
    }
    $("#loginBtn").on("click", function () {
        SetLoading(true,"正在登录，请稍后");
        $(this).prop("disabled",true);
        submit();
        $(this).prop("disabled",false);
    });
    $(document).keyup(function () {
        SetLoading(true,"正在登录，请稍后");
        if (event.keyCode === 13) {
            submit()
        }
    });
</script>
</body>

</html>